<div class="carousel-wrapper">
  <div class="carousel">
    <ul>
      {% for item in gallery.contents %}
        <li>
          {% if item.type == 'image' %}
            <a href="{{ STATIC_URL }}{{ item.image }}">
              <img src="{{ STATIC_URL }}{{ item.thumbnail_image }}" width="157" alt="{{ item.alt_text }}"{% if forloop.first %}class="active"{% endif %}>
            </a>
          {% else %}
            <a href="{{ item.url }}" rel="video">
              <img src="{{ STATIC_URL }}{{ item.thumbnail_image }}" width="157" alt="{{ item.name }}"{% if forloop.first %}class="active"{% endif %}>
            </a>
          {% endif %}
          </a>
        </li>
      {% endfor %}
    </ul>
  </div>
  <div class="carousel-nav">
    <a href="#" class="carousel-next right-arrow"><span>&lt;</span></a>
    <a href="#" class="carousel-prev left-arrow"><span>&gt;</span></a>
  </div>
</div>